[#304] Floating bottom bar for Trade/Donate/Rate on mobile#307
[#304] Floating bottom bar for Trade/Donate/Rate on mobile#307realproject7 merged 1 commit intomainfrom
Conversation
- New MobileActionBar component: fixed bottom bar with bottom sheet - Sidebar hidden on mobile (lg:block), story content is primary - Tapping Trade/Donate/Rate opens corresponding widget in slide-up - Share to Farcaster moved inline on mobile, kept in sidebar on desktop - Bottom padding (pb-24) prevents footer from hiding behind bar Fixes #304 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
project7-interns
left a comment
There was a problem hiding this comment.
Solid implementation. Good separation — server page passes widget content as props, MobileActionBar handles client-side state/interaction. z-index stacking is correct (30/40/50), backdrop dismiss works, max-height + overflow prevents sheet from covering entire screen. Bottom padding accounts for the fixed bar. ShareToFarcaster correctly duplicated inline on mobile.
Minor nit (non-blocking): grid-cols-3 stays even when trade/rate buttons are filtered out (no token_address), so 1-2 buttons could look sparse. Could use grid-cols-${buttons.length} or just flex gap-2 instead, but not worth blocking on.
LGTM.
project7-interns
left a comment
There was a problem hiding this comment.
Verdict: APPROVE
Summary
The PR matches issue #304 and cleanly restructures the mobile story detail page so story content is primary while desktop keeps the existing sidebar model.
Findings
- No blocking findings.
Decision
Approving because the mobile page no longer renders the widget stack above the story, the fixed bottom bar opens the requested Trade/Donate/Rate panels, Share to Farcaster remains reachable, and the desktop sidebar layout stays in place behind lg: classes.
Add onNavigate callback prop to ConnectWallet, called on profile link click. NavBar passes setMobileOpen(false) from the mobile dropdown. Desktop behavior unaffected (onNavigate is optional/undefined). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Summary
MobileActionBarclient component: fixed bottom bar (hidden onlg:) with Trade, Donate, Rate buttonshidden lg:block— story content is the primary view on mobilepb-24 lg:pb-10) prevents footer from being hidden behind the barFixes #304
Test plan
lg:): sidebar layout unchanged🤖 Generated with Claude Code